import { defineComponent } from "vue";
import { formItemProps, availableFormItemKeys } from "./form-types";
import TitanFormRender from "./Render";

export default defineComponent({
  name: "TitanFormItem",
  props: formItemProps,
  setup({ column, form }) {
    const _formItemProps = availableFormItemKeys.reduce((total: any, key) => {
      if (column[key as keyof typeof column] !== undefined) {
        total[key] = column[key as keyof typeof column];
      }
      return total;
    }, {});

    const renderProps = {
      render: column.render ? column.render : () => "",
      form,
    };

    return () => <a-form-item {..._formItemProps}>{<TitanFormRender {...renderProps} />}</a-form-item>;
  },
});
